// src/APP.vue

<template>
   <div>
        <h1>星球大战人物</h1>
    </div>
      <div>Suspense存在两个插槽，一个是default，另一个是fallback，default插槽中的内容是当该插槽中的组件异步请求完成之后的UI，fallback插槽是异步请求中处理的UI</div>
    <Suspense>
        <template #default>
            <CyPeoples />
        </template>
        <template #fallback>
            <div>
                <h3>数据加载中……</h3>
            </div>
        </template>
    </Suspense>
</template>

<script lang="ts">
import { defineComponent  } from 'vue'
import CyPeoples from './components/Peoples.vue'

export default defineComponent({
  name:"APP",
  components: {
    CyPeoples
  }
})
</script>